import * as DotEnv from 'dotenv'
import * as path from 'path'

DotEnv.config()

export default {
  mode: 'universal',
  loading: {
    color: '#fff',
    height: '6px'
  },
  extensions: [ 'ts' ],
  env: {
    baseUrl: process.env.DEBUG
  },
  head: {
    title: 'vue',
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      { hid: 'description', name: 'description', content: 'vue Website' }
    ],
    link: [ { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' } ]
  },
  css: [
    '@/assets/scss/main.scss'
  ],
  plugins: [

    '~/plugins/enter.ts', '~/plugins/class-components.ts', { src: '~/plugins/vue-blu.ts', ssr: false },
  ],
  modules: [
    [ '@nuxtjs/axios', '@nuxtjs/proxy', {credentials: true, } ]
  ],
  axios: { prefix: '/api/', proxy: true  },
  proxy: [
    [
      '/api',
      {
        target: process.env.API_URL, // api主机
        pathRewrite: { '^/api' : '/' }
      }
    ]
  ],

  render: {
    bundleRenderer: {
      shouldPreload: (file, type) => {
        return false
      }
    }
  },
  build: {
    extractCSS: true,
    analyze: false,
    splitChunks: {
      pages: true,
      vendor: true,
      commons: true,
      runtime: true,
      layouts: false
    },
    optimization: {
      splitChunks: {
        name: true,
        cacheGroups: {
          commons: {
            test: /[\\/]node_modules[\\/]/,
            name: 'vendor',
            chunks: 'all'
          }
        }
      }
    },
    extend(config, { isClient }) {

      // RegExp.prototype.toJSON = RegExp.prototype.toString;
      // fs.writeFileSync('test.json', JSON.stringify(config.module.rules))

      if (isClient) {
        config.optimization.splitChunks.name = 'common-pages'
      }

      /**
       * Config Babel Loader
       */
      const babelLoader = config.module.rules
        .find(({ test }) => test.toString() === '/\\.jsx?$/')
        .use.find(({ loader }) => loader === 'babel-loader')

      babelLoader.options = { babelrc: true }

      config.module.rules.push({
        test: /\.vue$/,
        loader: 'markup-inline-loader',
        options: {
          strict: '[inline]'
        }
      })

      /**
       * Configure Typescript Loader
       */
      config.resolve.extensions.push('.ts')
      config.module.rules.push({
        test: /\.ts$/,
        exclude: /node_modules/,
        use: [
          { loader: 'babel-loader', options: { babelrc: true } },
          {
            loader: 'ts-loader',
            options: {
              appendTsSuffixTo: [ /\.vue$/ ],
              transpileOnly: true
            }
          }
        ]
      })

      config.module.rules.push({ test: /\.gridelrc$/, use: 'json-loader' })

      /**
       * Configure Sass loader
       */
      config.module.rules
        .find(({ test }) => test.toString() === '/\\.scss$/')
        .oneOf.forEach(module => {

        const loader = module.use.find(
          ({ loader }) => loader === 'sass-loader'
        )

        loader.options = {
          sourceMap: loader.options.sourceMap,
          includePaths: [ path.resolve(__dirname, 'assets/scss') ],
          data: '@import "./global.scss";'
        }

      })
    }
  }
}
